<docs>
  ## 职位模块
</docs>
<template>
  <div class="info">
    <div class="info_content" v-show="!dataflag">
      <div class="info_item">
        <div class="item_row clearfix">
          <span class="info_name">{{data.gwmc}}</span>
          <span class="info_money">
            {{data.xcfw}}
            <span class="info_dw">/月</span>
          </span>
        </div>
        <div class="item_row clearfix mini_bottom">
          <span class="info_study xueli" :class="[data.zy?'':'width_larges']" v-show="data.xlmc">
            {{data.xlmc}}
          </span>
          <span class="info_study laiyuan" :class="[data.xlmc?'':'width_larges']" v-show="data.zy">
            {{data.zy}}
          </span>
          <span class="info_num">招聘人数：{{data.rs}}人</span>
        </div>
      </div>

      <div class="info_item">
        <div class="item_row large_bottom">
          <span class="info_title">工作地点</span>
        </div>
        <div class="item_row">
          <!-- <div ref="container" style="height: 300px;"></div> -->
          <p class="info_map">
            <!-- <img src="~common/images/icon-dingwei.png" alt /> -->
            <span class="mapTxt">{{data.dz}}</span>
          </p>
        </div>
      </div>

      <div class="info_item padding_may" v-show="data.gwsm">
        <div class="item_row">
          <span class="info_title">岗位描述</span>
        </div>
        <div class="bottom_line"></div>
        <div class="info_duty">
          <!-- <div class="duty_title">
            <img src="~common/images/icon-zhiweimiaoshu.png" alt />
            岗位说明
          </div> -->
          <div class="duty_title">
            <p>{{data.gwsm}}</p>
            <!-- <p>2. 项目相关的跨部门沟通及对外客户沟通</p>
            <p>3. 承担具体项目工作，进行项目调研、方案制定、具体工作推</p>-->
          </div>
        </div>
        <!-- <div class="info_duty">
          <div class="duty_title">
            <img src="~common/images/icon-zhiweimiaoshu.png" alt="">
            任职职责
          </div>
          <div>
            <p> 1. 医学研究团队的日常流程制定与工作管理</p>
            <p>2. 项目相关的跨部门沟通及对外客户沟通</p>
            <p>3. 承担具体项目工作，进行项目调研、方案制定、具体工作推</p>
          </div>
        </div>-->
      </div>
    </div>
    <div class="info_bottom" v-show="!dataflag">
      <button class="btn btn-light btn_sc" @click="POST_sc()">
        <img v-show="sc_flag" src="~common/images/qxsc.png" alt />
        <img v-show="!sc_flag" src="~common/images/sc.png" alt />
        {{sc_txt}}
      </button>
      <button :class="[data.gwsfcq == 0 ? 'not_allowed' : '']" class="btn_sc btn btn-light btn_td" @click="POST_td()">
        <img src="~common/images/tdjl.png" alt />
        {{td_txt}}
      </button>
    </div>
    <div class="no-text" v-show="dataflag">暂无数据</div>
  </div>
</template>
<script>
import $ from "@/common/js/axios";

export default {
  data() {
    return {
      sc_txt: "收藏",
      //只投递一次标志
      td_txt:"投递简历",
      dataflag: false,
      sc_flag: true,
      data: {},
      submitDate:{
        tyshxydm:"",
        gwid:""
      },
      gwsfcq:""
    };
  },
  methods: {
    //投递简历
    POST_td() {
      if (this.gwsfcq == 0) {
        this.$alert({
          type: "warning",
          message: "该岗位发布日期已过期！"
        });
        return
      }
      if(this.td_txt == "已投递"){
        this.$alert({
          type: "warning",
          message: "该岗位已投递！"
        });
        return
      }
      $.post("/rmgw/tdjlBc", {
        tyshxydm: this.$route.query.dm,
        gwid: this.$route.query._id
      })
        .then(res => {
          let _res = res.returnData;
          if (+_res.executeResult == 1) {
            this.$alert({
              type: "success",
              message: _res.message
            });
            this.GET_search(this.submitDate.tyshxydm, this.submitDate.gwid);
          } else {
            this.$alert({
              type: "warning",
              message: _res.message
            });
          }
        })
        .finally(() => {
          this.$loading = false;
        });
    },
    //收藏 取消收藏岗位
    POST_sc() {
      if (this.sc_flag && this.sc_txt == "取消收藏") {
        this.$confirm("是否取消收藏？", "", {
          cancleBtnText: "取消",
          confirmBtnText: "确认"
        })
          .then(() => {
            $.post("/rmgw/scgwqxBc", this.submitDate)
              .then(res => {
                let _res = res.returnData;
                if (+_res.executeResult == 1) {
                  this.$alert({
                    type: "success",
                    message: _res.message
                  });
                  this.sc_flag = false;
                  this.sc_txt = "收藏";
                } else {
                  this.$alert({
                    type: "warning",
                    message: _res.message
                  });
                }
              })
              .finally(() => {
                this.$loading = false;
              });
          })
          .catch(() => {});
      } else {
        $.post("/rmgw/scgwBc", this.submitDate)
          .then(res => {
            let _res = res.returnData;
            if (+_res.executeResult == 1) {
              this.$alert({
                type: "success",
                message: _res.message
              });
              this.sc_flag = true;
              this.sc_txt = "取消收藏";
            } else {
              this.$alert({
                type: "warning",
                message: _res.message
              });
            }
          })
          .finally(() => {
            this.$loading = false;
          });
      }
    },
    //回显
    async GET_search(dm, id) {
      this.$loading = true;
      const res = await $.get(`/rmgw/gwxxCx?tyshxydm=${dm}&gwid=${id}`)
      const {executeResult, message, gwxq } = res.returnData;
      // 无查询结果
      this.$loading = false;
      if (+executeResult === 1) {
        this.dataflag = false;
        this.data = gwxq;
        // 收藏判断显示文字
        if (gwxq.sfbsc == 1) {
          this.sc_flag = true;
          this.sc_txt = "取消收藏";
        } else {
          this.sc_flag = false;
          this.sc_txt = "收藏";
        }
        this.gwsfcq = gwxq.gwsfcq;
        if(gwxq.sfytd == 1){
          this.td_txt = "已投递";
        } else{
          this.td_txt = "投递简历";
        }
      } else {
        this.$alert({
          type: "warning",
          message: message
        });
        this.dataflag = true;
        return false;
      }
    }
  },
  created() {
    this.submitDate.tyshxydm = this.$route.query.dm;
    this.submitDate.gwid = this.$route.query._id;
    this.GET_search(this.submitDate.tyshxydm, this.submitDate.gwid);
  }
};
</script>
<style scoped lang="scss">
@import "~common/scss/var.scss";
.info {
  .info_content {
    padding: $padding;
    .info_item {
      background-color: $color-white;
      border-radius: $radius-base2;
      font-size: $font-size-small;
      padding: $padding 0;
      padding-bottom: $padding-base;
      box-sizing: border-box;
      margin-bottom: $padding/2;
      .item_row {
        color: $color-text;
        padding: 0 $padding;
        margin-bottom: $margin-base;
        .info_name {
          font-size: $font-size-ultra / 3 * 2;
          font-weight: bold;
          width: 50%;
          float: left;
          line-height: $line-height-base;
        }
        .info_money {
          float: right;
          width: 45%;
          color: $color-error;
          margin-top: $margin-base-small * 2;
          font-size: $font-size-large;
          word-wrap: break-word;
          text-align: right;
        }
        .info_dw {
          color: #817e81;
          font-size: $font-size-small;
        }
        .info_study {
          padding-left: $font-size-larges;
        }
        .laiyuan, .xueli{
          float: left;
          vertical-align: top;
          margin-right: $radius-base;
        }
        .xueli{
          background: url('~common/images/icon-xueli.png') 3px 0 no-repeat;
          background-size: 30px;
          min-width: $height-bg_img;
          max-width: $height-bg_img*2;
        }
        .laiyuan{
          min-width: $height-bg_img;
          max-width: $height-bg_img*2;
          background: url('~common/images/icon-laiyuan.png') 3px 0 no-repeat;
          background-size: 30px;
          margin-right:0;
        }
        .width_larges{
          width:55%;
        }
        .info_num {
          float: right;
          width: 37%;
          word-wrap: break-word;
          text-align: right;
        }
        .info_title {
          color: $color-title;
          font-size: $font-size-ultra / 3 * 2;
          font-weight: bold;
        }
        .info_map {
          margin-right: 0;
        }
        .mapTxt {
          line-height: $line-height-txt;
          // display: inline-block;
          // width: 85%;
        }
      }
      .large_bottom {
        margin-bottom: $font-size-large;
      }
      .mini_bottom {
        margin-bottom: $padding-base;
      }
      .bottom_line {
        display: inline-block;
        height: 2px;
        width: 100%;
        border-top: $border;
      }
      .info_duty {
        padding: 0 $padding;
        line-height: $line-height-txt;
        .duty_title {
          padding: $padding 0;
          // font-size: $line-height;
          font-size: $font-size-small;
          font-weight: 400;
          color: $color-text-title;
          line-height: $line-height-base;
          img {
            height: $line-height;
            width: $line-height/4;
            margin-right: $padding-base;
            vertical-align: middle;
          }
        }
      }
    }
    .padding_may {
      padding-bottom: $padding;
      margin-bottom: 1.5rem;
    }
  }
  .info_bottom {
    position: fixed;
    bottom: 0;
    width: 100%;
    padding: $padding-base-half * 2;
    height: $height-input + $margin-base-half;
    box-sizing: border-box;
    background-color: $color-white;
    font-size: $line-height;
    font-weight: 400;
    img {
      height: $width-img;
      width: $width-img;
      vertical-align: bottom;
    }
  }
  .btn_sc {
    float: left;
    width: 38%;
    height: 100%;
    background-color: $color-btn_bg;
    border: 1px solid #014987;
    border-radius: $line-height/2;
  }
  .btn_td {
    float: right;
    width: 60%;
    height: 100%;
    color: $color-white;
    border: 1px solid #014987;
    background: linear-gradient(90deg, #0a4c83, #2360fd);
  }
  .not_allowed{
    cursor: not-allowed;
  }
}
</style>
